웹 개발

루트캠프_02_첫 배포_Vercel

작성자 : Heehyeon Yoo|2025-11-12
# Blog# Deployment# Vercel# Next.js# Team

개발과 배포

https://fmhy.net 디자인을 참고해서 구성했다.
기능적으로 엄청난 걸 만들기보다 활용할 만하고 예쁘고 깔끔해서 자주 들어오고 싶은 곳이 되면 좋겠다고 생각했다.
안랩 보안 뉴스를 RSS로 가져오고 커리어 관련 조사 내용도 붙여서 구성했다.
팀 전용 페이지인 만큼 일반적인 정보 제공 페이지보다 팀 색을 조금 더 넣고 싶었다.
로고도 만들고 팀원 소개 페이지도 넣었다. 각 진로 중 팀원들이 관심 있는 분야를 고르고 그걸 위해 각자 어떻게 노력하는지도 보여주면 좋겠다고 봤다.

후닥닥 만든 것치고는 꽤 잘 나왔다. 그래서 바로 배포를 생각했다.
스파게티 코드긴 하지만 어차피 팀원 5명만 쓰는 건데 뭐 어떤가 싶었다.

Vercel로 배포해보자

배포는 Vercel로 결정했다.
Next.js에 최적화돼 있고 운용도 쉽다. 무료인 점도 컸다.

  • Next.js 공식 호스팅에 가까운 안정성
  • GitHub 연동으로 자동 배포 가능
  • 프리뷰 링크로 팀 피드백 수집 가능
  • 무료 플랜에서도 충분히 사용 가능

Vercel에 올리기 전에 아래를 먼저 정리했다.

  • .env 변수 분리 (API 키/접근 코드)
  • 빌드/실행 명령어 명확화
  • 정적 리소스 경로 확인

배포 후에는 다음을 우선 확인했다.

  • 주요 페이지 정상 로딩 (뉴스/진로/사이트/팀 소개)
  • 반응형 레이아웃 깨짐 여부
  • 데이터 로딩 속도
  • 팀원들이 바로 접속 가능한지

특이사항 없음!

깔끔하게 배포됐고 따로 도메인을 고민할 필요 없이 기본 도메인으로 공유했다.
팀원들도 좋아했다. 사소한 거라도 포폴이든 어디든 자기가 참여한 프로젝트 링크 한 줄 더 넣을 수 있으면 좋겠다고 생각했다.
멤버 로그인 기능도 넣어서 개인적인 내용들은 알아서 수정하게끔 유도할 것이다.